<html>
    <head>
        <title>控制更新</title>
    </head>
    <body>
        <script>
            // 控制更新
                    /*
                        感谢Vue的响应式系统，它始终知道何时进行更新(如果你用对了的话)。
                        不过还是有一些边界情况，你想要强制更新，尽管表面上看响应式的数据没有发生改变。
                        也还有一些情况，你会想要阻止不必要的更新。
                    */

                    // 一、强制更新
                                /*
                                    如果你发现你自己需要在Vue中做一次强制更新， 99.9%的情况，是你在某个地方做错了事情。
                                */
                                /*
                                    你可能还没有留意到"数组"或者"对象"的变更检测注意事项，后者你可能依赖了一个未被Vue的响应式系统追踪的状态。

                                    然而，如果你已经做到了上述的事项，仍然发现在极少的情况喜爱需要手动强制更新，
                                    那么你可以通过使用 $forceUpdate() 方法来做这件事。
                                */


                    // 二、通过 v-once 创建"低开销的静态组件"
                                /*
                                    渲染普通的HTML元素在Vue中是非常快速的，但有的时候你可能有一个组件，这个组件包含了大量静态内容。
                                    
                                    在这种情况下，你可以在组件模板中的根元素上使添加 v-once 标签属性 以确保这些内容只计算一次然后缓存起来。

                                    就像这样：
                                */
                                        Vue.component('terms-of-service',{
                                            template:`
                                                <div v-once>
                                                    <h1> Terms of Service</h1>
                                                    .... a lot of static content ....
                                                </div>
                                            `
                                        });

                                /*
                                    再次强调：
                                        试着不要过度使用这个模式。
                                        当你需要渲染大量静态内容时，极少数的情况下它会给你带来便利，除非你非常留意渲染变慢了，
                                        不然它完全是没有必要的----再加上他后期会带来很多困惑。
                                        例如：  设想另一个开发者并不属性 v-once 或者看漏了它在模板中，他们可能会化很多个小时去找出模板为什么无法正确更新！
                                */
        </script>
    </body>
</html>